@extends('admin.layout')
@section('content')
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>
                Data Tables
                <small>advanced tables</small>
            </h1>
            <ol class="breadcrumb">
                <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
                <li><a href="#">Tables</a></li>
                <li class="active">Data tables</li>
            </ol>
        </section>

        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box">
                        <div class="box-header">
                            <h3 class="box-title">Hover Data Table</h3>
                        </div><!-- /.box-header -->
                        <div class="box-body">

                        @if(session('info'))
                        <div class="callout callout-success">
                            <p>{{session('info')}}</p>
                        </div>
                        @endif

                        	<form action="{{ url('/admin/user/index') }}">
	                        	<div class="row">
	                        		<div class="col-sm-8">
	                        			<div class="dataTables_length" id="example1_length"><label>显示 <select name="num" aria-controls="example1" class="form-control input-sm">
	                        				<option 
	                        				@if(!empty($request['num']) && $request['num'] == 10) selected="selected"
	                        				@endif
	                        				 value="10">10</option>
	                        				<option @if(!empty($request['num']) && $request['num'] == 25) selected="selected"@endif
	                        				value="25">25</option>
	                        				<option @if(!empty($request['num']) && $request['num'] == 50) selected="selected" @endif
	                        				value="50">50</option>
	                        				<option @if(!empty($request['num']) && $request['num'] == 100) selected="selected" @endif
	                        				value="100">100</option>
	                        			</select> 条</label>
	                        			</div>
	                        		</div>
	                    			<div class="col-sm-4">
	                					<div class="input-group input-group-sm">
			                                <input value="{{ $request['keyword'] or '' }}" name="keyword" class="form-control" type="text">
						                    <span class="input-group-btn">
						                      <button class="btn btn-info btn-flat" type="submit">搜索</button>
						                    </span>
			                            </div>
	                    			</div>
	                        	</div>
                        	</form>
                            <table id="example2" class="table table-bordered table-hover">
                                <thead>
                                <tr>
                                    <th>ID</th>
                                    <th>用户名</th>
                                    <th>邮箱</th>
                                    <th>头像</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr>
                                @foreach($data as $v)
                                    <td>{{ $v -> id }}</td>
                                    <td class="cname">{{ $v -> name }}</td>
                                    <td>{{ $v -> email }}</td>
                                    <td><img width="50" 
                                    @if($v -> pic == 'default.jpg')
                                        src="/uploads/{{ $v -> pic }}"
                                    @else
                                        src="/uploads/imgs/{{ $v -> pic }}"
                                    @endif
                                    /></td>
                                    <td><a href="{{ url('/admin/user/edit') }}/{{ $v -> id }}">编辑</a><a href="{{ url('/admin/user/delete') }}/{{ $v -> id }}"> 删除</a></td>
                                </tr>
                                @endforeach
                                </tbody>

                            </table>
                            {{ $data -> appends($request) -> links() }}
                        </div><!-- /.box-body -->
                    </div><!-- /.box -->
                </div><!-- /.col -->
            </div><!-- /.row -->
        </section><!-- /.content -->
</div><!-- /.content-wrapper -->
@endsection
<!-- 添加单击姓名事件 -->
<script type="text/javascript">
    window.onload = function()
    {
        function dblChangeName(){
            var td = $(this);
            var id = $(this).prev().html();
            var oldName = $(this).html();
            var inp = $('<input type="text" />');
            inp.val(oldName);
            $(this).html(inp);
            inp.select();

            inp.on('blur',function(){
                var newName = inp.val();
                td.one('dblclick',dblChangeName);
                $.ajax({
                    type:'POST',
                    url:"{{url('/admin/user/ajaxchangename')}}",
                    data:{id:id,name:newName},
                    headers:{
                    'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                    },
                    success:function(data)
                    {
                        if(data == 0)
                        {
                            alert('用户名已存在');
                            td.html(oldName);
                        }else if(data == 1)
                        {
                            td.html(newName);
                        }else
                        {
                            td.html(oldName);
                        }
                    },
                    error:function()
                    {
                        alert('异常');
                    },
                    dataType:'json'
                });
            });
        }

        $('.cname').one('dblclick',dblChangeName);
    }
 
</script>